import React from 'react';
import { connect } from 'umi';
import { Input, Row, Col } from 'antd';
import AuthorizeSearch from "../../components/limit/authorize/AuthorizeSearch";
import AuthorizeToolbar from "../../components/limit/authorize/AuthorizeToolbar";
import AuthorizeList from "../../components/limit/authorize/AuthorizeList";
import TablePagination from '../../components/common/TablePagination';
import MenuLimitDrawer from "../../components/limit/authorize/MenuLimitDrawer";
import LimitRelateTree from "../../components/common/LimitRelateTree";

const {Search} = Input;

class AuthorizePage extends React.Component {

  render() {

    let { dispatch, globalModel, authorizeModel } = this.props;
    const {
      authorizeList, departmentList, total, departmentLoading, operateType, departmentModalVisible, currentPage,
      pageSize, selectedRowKeys, selectedRows, departmentInfoData, searchParams, radioValue, menuList, parentRecord,
      correlateList, menuLimitDrawerVisible, bizType, correlateType, limitList, companyList, authorizeVos
    } = authorizeModel;

    const authorizeSearchProps = {
      onSearch: (searchParams) => {
        dispatch({type: "authorizeModel/updateState", payload: {searchParams}});
        dispatch({type: 'authorizeModel/getListDatas', payload: {currentPage, pageSize, params: searchParams}});
      },
      onReset: () => {
        dispatch({type: "authorizeModel/updateState", payload: {searchParams: null}});
      },
    }

    const authorizeToolbarProps = {
      correlateType,
      onDeleteAuthorize: () => {
        const params = "role" == radioValue ? {menuLimitDrawerVisible: true}: {userAllotTransferVisible: true};
        dispatch({ type: "authorizeModel/deleteAuthorize", payload: params });
      },
      onShowAuthorize: () => {
        dispatch({ type: "authorizeModel/getAuthorizeList", payload: { type: correlateType, targetKey: parentRecord.id }});
        if (correlateType == 0) {
          dispatch({ type: "authorizeModel/getAppRelateMenuTree", payload: { targetCode: parentRecord.longCode }});
        } else if (correlateType == 1) {
          dispatch({ type: "authorizeModel/getUnitNodeTree", payload: { type: "5" }});
        } else if (correlateType == 2) {
          dispatch({ type: "authorizeModel/getMenuTree", payload: { currentPage: 1, pageSize: 999999 }});
        }
        dispatch({ type: "authorizeModel/updateState", payload: { menuLimitDrawerVisible: true }});
      }
    }

    const authorizeListProps = {
      correlateType,
      currentPage,
      pageSize,
      departmentList,
      departmentLoading,
      authorizeList,
      radioValue,
      rowSelection: {
        selectedRowKeys,
        selectedRows,
        onChange: (keys, selectedRows) => {
          dispatch({
            type: 'authorizeModel/updateState',
            payload: {
              selectedRows: selectedRows,
              selectedRowKeys: keys,
            },
          })
        },
      }
    }

    const tablePaginationProps = {
      total,
      currentPage,
      pageSize,
      onPageChange: (currentPage, pageSize) => {
        dispatch({type: 'authorizeModel/getListDatas', payload: {currentPage, pageSize, ...searchParams}});
      },
      onShowSizeChange: (currentPage, pageSize) => {
        dispatch({type: 'authorizeModel/getListDatas', payload: {currentPage, pageSize, ...searchParams}});
      },
    }

    const menuLimitDrawerProps = {
      menuLimitDrawerVisible,
      authorizeVos,
      menuList: correlateType == 0 || correlateType == 2 ? menuList : limitList,
      onSaveSelectNode: (subjectCode) => {
        dispatch({ type: "authorizeModel/onAddAuthorize", payload: { type: correlateType, targetId: parentRecord.targetId, targetCode: parentRecord.longCode, subjectCode }});
      },
      onClose:() => {
        dispatch({ type: "authorizeModel/updateState", payload: { menuLimitDrawerVisible: false }});
      }
    }

    const limitTargetTreeProps = {
      bizType,
      correlateType,
      limitList,
      onRadioChange: (e) => {
        const value = e.target.value;
        dispatch({type: "authorizeModel/updateState", payload: { correlateType: value }});
        dispatch({type: "authorizeModel/getAuthorizePage", payload: { type: value }});

        if (value == "0") {
          dispatch({ type: "authorizeModel/getUnitNodeTree", payload: { type: "0" }});
        } else if (value == "1") {
          dispatch({ type: "authorizeModel/getUnitNodeTree", payload: { type: "0,1,2,3,4,5,6" }});
        } else if (value == "2") {
          dispatch({ type: "authorizeModel/getApplicationList", payload: {}});
        }
      },
      onSearchCompany: (value) => {
      },
      onSelectTreeNode: (keys, event) => {
        const parentNode = event?.node;
        dispatch({ type: "authorizeModel/updateState", payload: { parentRecord: parentNode }});
        dispatch({ type: 'authorizeModel/getAuthorizePage', payload: { type: correlateType, targetKey: parentNode.id }});
      }
    }

    return (
      <div style={{ width: 'calc(100% - 30px)', height: 'calc(100% - 30px)', padding: "15px" }}>
        <Row style={{ height: "100%", width: "100%" }}>
          <Col span={4}>
            <LimitRelateTree { ...limitTargetTreeProps } />
          </Col>
          <Col span={20} style={{ padding: "0px 0px 0px 15px", borderLeft: "1px solid rgba(0, 0, 0, 0.06)" }}>
            <AuthorizeSearch {...authorizeSearchProps} />
            <AuthorizeToolbar {...authorizeToolbarProps} />
            <AuthorizeList {...authorizeListProps} />
            <TablePagination {...tablePaginationProps} />
          </Col>
        </Row>

        <MenuLimitDrawer {...menuLimitDrawerProps} />
      </div>
    );
  };
}

function mapStateToProps({globalModel, authorizeModel}){
  return {globalModel, authorizeModel};
}

export default connect(mapStateToProps)(AuthorizePage);
